import React, { Component } from 'react';
import {Setstyled} from './StyleSet';
import Choose from './components/Choose';

import Navigation from 'components/Navigation/Navigation'

import ht from 'images/my/huitui@3x.png'

import tsy from 'images/my/tixingyin.png'
import xgmm from 'images/my/xiugaimima (2).png'
import gywm from 'images/my/guanyuwomen.png'
import xggrzl from 'images/my/xiugai.png'
import connect from '../redux-component/connect'

@connect
class Set extends Component{
    state = {

    }
    render(props) {

        return(
            <Setstyled>
                <Navigation 
                leftImg = {ht} 
                leftImgWidth = '.2rem'
                leftImgHeight = '.2rem'
                leftPadding = '0 0 0 .095rem'
                title = "设置"
                titleSize = '.17rem'
                clickLeft = {()=>this.onClickLeft("left")}
                ></Navigation> 
                <Choose src={tsy} 
                title="提示音设置" 
                leftwidth='.22rem' 
                paddingwidth= '.05rem'
                handleClick={()=>this.onhandleClick(1)}>
                </Choose>
                <Choose src={xgmm} 
                title="修改密码" 
                leftwidth='.22rem' 
                paddingwidth= '.05rem'
                handleClick={()=>this.onhandleClick(2)}>
                </Choose>
                <Choose src={gywm} 
                title="关于我们" 
                leftwidth='.22rem' 
                paddingwidth= '.05rem'
                handleClick={()=>this.onhandleClick(3)}>
                </Choose>
                <Choose src={xggrzl} 
                title="修改个人资料" 
                leftwidth='.22rem' 
                paddingwidth= '.05rem'
                handleClick={()=>this.onhandleClick(4)}>
                </Choose>
                <div className="container" onClick={()=> this.clickOut()}>
                    <div className="out">
                        <p>退出登录</p>
                    </div>
                </div>
            </Setstyled>
        );
    }
    // logout(){
    //     this.props.logout()
    //     this.props.history.params('/index')
    // }
    onhandleClick(tag){
        switch(tag){
            case 1:
                this.props.history.push('/myChildRouter/sound',{tag});
                break;
            case 2:
                this.props.history.push('/myChildRouter/changepsw',{tag});
                break;
            case 3:
                this.props.history.push('/myChildRouter/about',{tag});
                break;
            case 4:
               this.props.history.push('/myChildRouter/informations',{tag});
                break;
            default:
                console.log('error' );
        }
    }
    onClickLeft(tag){
        this.props.history.go(-1)
    }
    clickOut(tag){
        // console.log(this)
        this.props.logout()
        this.props.history.push('/index')
    }
} 
export default Set;